<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        div {
            display: none;
        }
    </style>
</head>

<body>

    <div class="login">
        欢迎 <strong>xx</strong> 登陆

        <button>退出</button>
    </div>

    <div class="noLogin">
        <a href="./reg.html">去注册</a>
        <a href="./login.html">去登陆</a>
    </div>

    <script>

        // 
        const cookies = document.cookie;
        console.log(cookies);

        // 切割成数组   cookie的bug  自动生成多了一个空格
        let arr = cookies.split('; ');
        // 继续切割
        arr = arr.map(item => {
            const arr2 = item.split('=');
            return {
                name: arr2[0],
                content: arr2[1]
            }
        });

        console.log(arr);


        // 在登陆页面有一个暗号'LOGIN_USER'
        const res = arr.find(item => item.name === 'LOGIN_USER');
        if (res) {
            // alert('登陆了')
            document.querySelector('.login').style.display = 'block';
            document.querySelector('strong').innerHTML = res.content;
        }
        else {
            alert('没有登陆')
        }



        // 退出的逻辑
        //    删除暗号 LOGIN_USER
        //    设置一个过期的时间
        // document.cookie = `LOGIN_USER=${username};expires=` + new Date(0)
        //    跳转到登陆


    </script>

</body>

</html>